<template>
  <div class="testVideo">
    <!-- <div id='player'></div> -->
    <!-- <video id="player" controls></video> -->
    <!-- <embed style="height:600px;" allowscriptaccess="always" allowfullscreen="true" quality="high" bgcolor="#000" src="https://zuidajiexi.net/ldg_ckplayer/ckplayer.swf" flashvars="variable=player&amp;volume=0.8&amp;autoplay=1&amp;video=https%3A%2F%2Fsohu.zuida-163sina.com%2F20190301%2Fdxqmmbg2%2Findex.m3u8&amp;playbackrate=1" width="100%"  id="chrkbcstyzcxupyheh" name="chrkbcstyzcxupyheh" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"> -->
    <div class="prism-player" id="player-con"></div>
  </div>
</template>

<script>
// import 'dplayer/dist/DPlayer.min.css';
// import DPlayer from 'dplayer';
export default {
  data() {
    return {
      videoContent: ''
    }
  },
 
  created() {
    
  },
  mounted () {
    // const dp = new DPlayer(
    //   {
    //     container: document.getElementById('player'),
    //     video: {
    //         // url: 'https://api.dogecloud.com/player/get.m3u8?vcode=5ac682e6f8231991&userId=17&ext=.m3u8',
    //         url: '/requist/demo1/demo.m3u8',
    //         type: 'hls'
    //     }
    //   }
    // )
    // if(Hls.isSupported()) {
    //   this.videoContent = document.getElementById('player');
    //   var hls = new Hls();
    //   hls.loadSource('/requist/demo1/demo.m3u8');
    //   hls.attachMedia(this.videoContent);
    //   // hls.on(Hls.Events.MANIFEST_PARSED,function() {
    //     // video.play();
    //   // })
    // }
    var player = new Aliplayer({
      "id": "player-con",
      "source": "https://api.dogecloud.com/player/get.m3u8?vcode=5ac682e6f8231991&userId=17&ext=.m3u8",
      "width": "100%",
      "height": "500px",
      "autoplay": true,
      "isLive": false,
      "rePlay": false,
      "showBuffer": true,
      "snapshot": false,
      "showBarTime": 5000,
      // "useFlashPrism": true,
      // "skinLayout": [
      //   {
      //     "name": "bigPlayButton",
      //     "align": "blabs",
      //     "x": 30,
      //     "y": 80
      //   },
      //   {
      //     "name": "controlBar",
      //     "align": "blabs",
      //     "x": 0,
      //     "y": 0,
      //     "children": [
      //       {
      //         "name": "progress",
      //         "align": "tlabs",
      //         "x": 0,
      //         "y": 0
      //       },
      //       {
      //         "name": "playButton",
      //         "align": "tl",
      //         "x": 15,
      //         "y": 26
      //       },
      //       {
      //         "name": "nextButton",
      //         "align": "tl",
      //         "x": 10,
      //         "y": 26
      //       },
      //       {
      //         "name": "timeDisplay",
      //         "align": "tl",
      //         "x": 10,
      //         "y": 24
      //       },
      //       {
      //         "name": "fullScreenButton",
      //         "align": "tr",
      //         "x": 10,
      //         "y": 25
      //       },
      //       {
      //         "name": "streamButton",
      //         "align": "tr",
      //         "x": 10,
      //         "y": 23
      //       },
      //       {
      //         "name": "volume",
      //         "align": "tr",
      //         "x": 10,
      //         "y": 25
      //       }
      //     ]
      //   },
      //   {
      //     "name": "fullControlBar",
      //     "align": "tlabs",
      //     "x": 0,
      //     "y": 0,
      //     "children": [
      //       {
      //         "name": "fullTitle",
      //         "align": "tl",
      //         "x": 25,
      //         "y": 6
      //       },
      //       {
      //         "name": "fullNormalScreenButton",
      //         "align": "tr",
      //         "x": 24,
      //         "y": 13
      //       },
      //       {
      //         "name": "fullTimeDisplay",
      //         "align": "tr",
      //         "x": 10,
      //         "y": 12
      //       },
      //       {
      //         "name": "fullZoom",
      //         "align": "cc"
      //       }
      //     ]
      //   }
      // ]
    }, function (player) {
        console.log("播放器创建了。");
      }
    )
  },
  methods:{
  }
}

</script>
<style scoped lang="stylus" rel="stylesheet/stylus">
@import '~style/base.styl';
.testVideo{
    width: 1200px;
    margin: 0 auto;
}
#player-con{
  margin: 50px 0;
}
</style>
